<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
    <script>
        // 2.es6的解构赋值 
        // ）定义：本质就是赋值，解构简单的理解就是左边一种结构，右边一种结构，左右一一对应。
        // 1)数组的解构赋值 变量要与需要的值 位置完全对应
        // 如果该位置没有数据 会解构到undefiend
          let arr=["于谦","郭德纲","麦克阿瑟",888]
          // let yuqian=arr[0];
          // let maike=arr[2];
          // let num=arr[3];
        let [yuqian,guodegang,maike,num,myname]=["于谦","郭德纲","麦克阿瑟",888];
        console.log(yuqian)
        console.log(guodegang)
        console.log(maike)
        console.log(num)
        console.log(myname)

        // 2) 对象的解构赋值
        // 对象的解构赋值的变量名必须与key名相同
        let obj={
          name:"奔驰",
          price:"180w",
          run:function(){
            console.log("跑起来")
          },
          list:["冰箱","彩电","沙发"]
        }
        // 以前的存储
        // let names=obj.name;
        // let price=obj.price;
        // es6的解构赋值
        let {price,name,run,list}=obj;
        console.log(price)
        console.log(name)
        run()
        console.log(list)
        // 后台返回的数据 常用场景
        let res={
          data:{
            total:180,
            page:1,
            pageSize:10,
            mylist:{
              bannerList:[],
              newsList:[]
            }
          }
        }
     let {total,page,mylist,pageSize}=res.data;
     let {bannerList,newsList}=mylist;
      // 3）解构赋值 可以给变量设置默认值 z=5 
      // 右边有值 默认值不生效
     let arr2=[x,y=3,z=5]=[1,2]
    let {age,sex="女"}={age:"19"}
        console.log(sex)
        console.log(age)
    // 4) 组合解构
      let arr4=["你好",{city:"廊坊",province:"河北省"},"天气晴"]
      let [hello,{city,province},tmep]=arr4;
      
      let obj8={
        lol:[
          "李白",
          {shan:"闪现",dian:"点燃"},
          "诸葛亮"
        ],
        pubg:["森林","海岛","沙漠"]
      }
      let {lol:[libai,{shan,dian},zhuge],pubg:[sen,hai,sha]}=obj8





      
    
    </script>
</body> 
</html>